import React, {useEffect, useRef, useState} from "react";
import {EditBuilder, EditClass, getClassAddjson} from "../../../../api/api.js";
import {Button, Col, Form, Modal, Row, Toast} from "@douyinfe/semi-ui";
import {IconPlus} from "@douyinfe/semi-icons";

function Builder_EForm(props) {
    const [visible, setVisible] = useState(false);
    useEffect(()=>{
        setTimeout(() => {
            if (api.current) {
                api.current.setValue("buildername", props.mess[0].buildName);
            }
        }, 0);
    },[visible])

    async function edit(){
        let form = new FormData()
        form.append("id",props.mess[0].lid)
        form.append("sex",api.current.getValues().sex)
        form.append("name",api.current.getValues().buildername)
        const res = await EditBuilder(form)
        if (res.data.code==200){
            Toast.success('寝室楼修改成功')
            handleOk()
        }else {
            Toast.success('寝室楼修改失败')
            handleOk()
        }
    }
    function valte() {
        api.current.validate()
            .then(values=>{
                edit()
            })
            .catch(errors=>{
                Toast.error("请重新填写表单")
            })
    }

    const showDialog = () => {
        setVisible(true);
    };
    const handleOk = () => {
        setVisible(false);
    };
    const handleCancel = () => {
        setVisible(false);
    };
    const handleAfterClose = () => {
    };
    const childRef = useRef();
    const list = [
        { value: '0', label: '女生寝室楼', otherKey: 0 },
        { value: '1', label: '男生寝室楼', otherKey: 3 },
    ];
    const api = useRef();

    return (
        <>
            <Button onClick={showDialog}  icon={<IconPlus />} theme="solid" style={{ marginRight: 10 }}>修改寝室楼</Button>
            <Modal
                okText={'Sounds great!'}
                style={{width:"30%",height:"30%"}}
                title={<div><IconPlus  style={{marginRight:"10px"}} />修改寝室楼</div>}
                visible={visible}
                onOk={handleOk}
                afterClose={handleAfterClose} //>=1.16.0
                onCancel={handleCancel}
                closeOnEsc={true}
                footer={
                    <div style={{textAlign:'center'}}>
                        <Button type="primary" onClick={()=>{valte()}}>
                            提交
                        </Button>
                    </div>

                }
            >
                <Row>
                    <Form
                        getFormApi={formApi=>api.current = formApi}
                        onSubmit={values => Toast.info({content: JSON.stringify(values)})}
                    >
                        <>
                            <Row>
                                <Col span={11}>
                                    <Form.Select
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'string', message: 'type error' },
                                            { validator: (rule, value) => value != null, message: '寝室楼类别不能为空' },
                                        ]}
                                        field={'sex'} label={"寝室楼类别"} placeholder="请选择寝室楼类别" style={{ width: '100%' }} optionList={list}></Form.Select>
                                </Col>
                                <Col span={11} offset={1}>
                                    <Form.Input
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'string', message: '请输入正确的文字' },
                                            { validator: (rule, value) => value != null, message: '寝室楼名称不能为空' },
                                        ]}
                                        label={'寝室楼名称'} field='buildername' placeholder='请输入寝室楼名称'/>
                                </Col>
                            </Row>
                        </>

                    </Form>
                </Row>
            </Modal>
        </>
    );
}
export default Builder_EForm